<template>
	<view>
		<navbar title="租赁详情" :autoBack="true"></navbar>
		<scroll-view scroll-y="true" >
			<view class="con">
				<view class="con__a">
					<view class="u-flex u-flex-y-center u-flex-between">
						<view class="con__a__t">
							审批详情
						</view>
						<view class="con__a__time">
							提交时间:{{$u.timeFormat(info.createtime, 'yyyy-mm-dd hh:MM:ss')}}
						</view>
					</view>
					<view class="con__a__box">
						<view class="">
							姓名: {{info.name}}
						</view>
						<view class="">
							电话: {{info.mobile}}
						</view>
						<view class="" v-if="info.saleInfo">
							销售: {{info.saleInfo.username}}
						</view>
						<view class="" v-if="info.method==1">
							收货方式: 上门自提 {{info.goodsInfo.address}}
						</view>
						<!-- hire_method 1=租完即送,2=随租随还', -->
						<view class="" v-if="info.hire_method==1">
							租赁方式: 租完即送
						</view>
						<view class="" v-if="info.hire_method==2">
							租赁方式: 随租随还
						</view>
						<!-- hire_num 1=6期,2=12期,3=24期' -->
						<view class="" v-if="info.hire_num==1">
							租赁期数: 6期
						</view>
						<view class="" v-if="info.hire_num==2">
							租赁期数: 12期
						</view>
						<view class="" v-if="info.hire_num==3">
							租赁期数: 24期
						</view>
						<view class="">
							每期租金: {{info.rent}}
						</view>
						<view class="">
							绑定银行卡: {{info.bank}}
						</view>
						<image src="/static/daikuan/spz.png" class="con__a__box__sp" mode="" v-if="info.exam==1"></image>
						<image src="/static/tool/ybh.png" class="con__a__box__sp" mode="" v-if="info.exam==2"></image>
						<image src="/static/tool/ywc.png" class="con__a__box__sp" mode="" v-if="info.exam==3"></image>
					</view>
				</view>
				<view class="con__b" v-if="info.goodsInfo">
					<image :src="URL(info.goodsInfo.image)" class="con__b__pic" mode=""></image>
					<view class="">
						<view class="con__b__name u-line-1">
							{{info.goodsInfo.name}}
						</view>
						<view class="con__b__text u-line-1">
							规格: {{ggtext}}
						</view>
						<view class="con__b__text u-line-1">
							租期: {{$u.timeFormat(info.createtime, 'yyyy.mm.dd')}}-{{$u.timeFormat(info.createtime+60*60*24*30*qishu, 'yyyy.mm.dd')}}（{{qishu*30}}天）
						</view>
						<view class="con__b__text u-line-1">
							数量: {{info.num}}
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
		<view class="footer" v-if="info.exam==1">
			<u-button color="#3262FD" :loading="loading" text="通过" @click="submit(3,2)"
				:customStyle='{width:"304rpx",height:"87rpx",margin:"0 15rpx",padding:0,borderRadius:"5rpx",fontSize:"24rpx",color:"#fff"}'></u-button>
			<u-button hairline plain color="#D5D5D5" :loading="loading" text="拒绝" @click="submit(2,5)"
				:customStyle='{width:"304rpx",height:"87rpx",margin:"0 15rpx",padding:0,borderRadius:"5rpx",fontSize:"24rpx",color:"#242424"}'></u-button>
		</view>
	</view>
</template>

<script>
	import boos from '@/api/_boos.js'
	export default {
		data() {
			return {
				id:null,
				loading:false,
				info:{},
				qishu:0,
				qishulist:[
					{t:1,v:6},
					{t:2,v:12},
					{t:3,v:24},
				],
				gglist:[],
				ggtext:''
			};
		},
		onLoad(o) {
			this.id=o.id
			this.getinfo()
		},
		methods:{
			async getinfo(){
				let res = await boos.orderInfo({id:this.id})
				if(res.data.code==1){
					this.info=res.data.data
					this.qishu=this.qishulist[Number(this.info.hire_num)-1].v
					JSON.parse(this.info.spec_json).map(t=>{
						this.gglist.push(t.name)
					})
					this.ggtext=this.gglist.join(',')
					
				}
			},
			async submit(exam){
				
				let res = await boos.editOrder({exam,id:this.id})
				let _this=this
				_this.loading=true
				if(res.data.code==1){
					uni.$u.toast('提交成功')
					setTimeout(()=>{
						_this.loading=false
						uni.navigateBack()
					},1000)
				}
			}
			
		}
	}
</script>

<style lang="scss">
page{
	background-color: #f8f8f8;
}
.con{
	padding: 20rpx 30rpx 170rpx;
	&__a{
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 45rpx 30rpx 43rpx;
		margin-bottom: 27rpx;
		&__t{
			font-family: PingFang SC;
			font-weight: 800;
			font-size: 32rpx;
			color: #010101;
			line-height: 32rpx;
		}
		&__time{
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 24rpx;
			color: #6D6D6D;
			line-height: 24rpx;
		}
		&__box{
			background: #F4F5FA;
			border-radius: 20rpx;
			margin-top: 32rpx;
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 26rpx;
			color: #78797E;
			line-height: 64rpx;
			padding: 10rpx 22rpx 24rpx;
			position: relative;
			&__sp{
				width: 105rpx;
				height: 92rpx;
				position: absolute;
				top: 67rpx;
				right: 33rpx;
			}
		}
	}
	&__b{
		padding: 34rpx 30rpx 32rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		display: flex;
		&__pic{
			width: 177rpx;
			height: 177rpx;
			background: #3262FD;
			border-radius: 15rpx;
			margin-right: 18rpx;
		}
		&__name{
			width: 420rpx;
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 30rpx;
			color: #1E1E1E;
			line-height: 52rpx;
			margin-bottom: 6rpx;
		}
		&__text{
			width: 420rpx;
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 24rpx;
			color: #7A7A7A;
			line-height: 24rpx;
			margin-bottom: 18rpx;
		}
	}
}
.footer{
	width: 750rpx;
	height: 150rpx;
	background: #FFFFFF;
	position: fixed;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
</style>
